<template>
  <div class="dashboard-container">
    <!-- 帆软报表 - 库存优化 -->
    <div class="fanruan-fullscreen">
      <div class="fanruan-header">
        <span class="title">📊 库存优化分析（帆软报表）</span>
        <div class="actions">
          <el-button 
            type="primary" 
            size="small" 
            @click="openFanruanInNewTab"
            :icon="View">
            新窗口打开
          </el-button>
          <el-button 
            size="small" 
            @click="redirectToFanruan">
            直接访问帆软
          </el-button>
        </div>
      </div>
      
      <!-- 使用object标签代替iframe -->
      <object 
        :data="fanruanReportUrl" 
        type="text/html"
        class="fanruan-object">
        <div class="fallback-content">
          <el-alert
            title="无法加载帆软报表"
            type="warning"
            description="请点击下方按钮直接访问帆软报表系统"
            show-icon>
          </el-alert>
          <div style="margin-top: 20px; text-align: center;">
            <el-button type="primary" size="large" @click="redirectToFanruan">
              访问帆软报表
            </el-button>
          </div>
        </div>
      </object>
    </div>
  </div>
</template>

<script setup>
import { ref, onMounted } from 'vue';
import { 
  Connection, Remove, View 
} from '@element-plus/icons-vue';
import { ElMessage } from 'element-plus';

// 响应式数据
const isConnected = ref(false);

// 帆软报表URL（使用本机IP，支持外部访问）
// 添加 op=fs 参数实现全屏模式，隐藏帆软的导航栏和工具栏
// 添加 __bypss__=true 跳过登录验证
const fanruanReportUrl = ref('http://10.223.9.4:8075/webroot/decision/view/report?viewlet=%E5%BA%93%E5%AD%98%E4%BC%98%E5%8C%96%2F%E5%BA%93%E5%AD%98%E4%BC%98%E5%8C%96.fvs&op=fs&__bypass__=true');


/**
 * 在新窗口打开帆软报表
 */
const openFanruanInNewTab = () => {
  window.open(fanruanReportUrl.value, '_blank');
};

/**
 * 直接跳转到帆软报表（当前窗口）
 */
const redirectToFanruan = () => {
  window.location.href = fanruanReportUrl.value;
};


/**
 * 组件挂载
 */
onMounted(() => {
  console.log('📊 帆软报表页面初始化...');
  isConnected.value = true;
  
  // 提示用户
  setTimeout(() => {
    ElMessage.info({
      message: '如果帆软报表无法显示，请点击"直接访问帆软"按钮',
      duration: 5000
    });
  }, 2000);
});
</script>

<style scoped lang="less">
.dashboard-container {
  padding: 0;
  background: #fff;
  min-height: 100vh;
  
  // 帆软全屏显示
  .fanruan-fullscreen {
    width: 100%;
    height: 100vh;
    display: flex;
    flex-direction: column;
    
    .fanruan-header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 15px 30px;
      background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
      color: white;
      box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
      
      .title {
        font-size: 20px;
        font-weight: bold;
      }
      
      .actions {
        display: flex;
        gap: 10px;
      }
    }
    
    .fanruan-object {
      flex: 1;
      width: 100%;
      height: calc(100vh - 60px);
      border: none;
      display: block;
      
      .fallback-content {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        height: 100%;
        padding: 40px;
      }
    }
  }
}
</style>
